<script setup>
import { onMounted, ref } from 'vue'
import gooditem from '@/components/gooditem.vue'
import { getnew } from '@/api/goodAPI'
import container from '@/components/container.vue'
const newlist = ref([])
onMounted(async () => {
  const res = await getnew()
  newlist.value = res.data.result
})
</script>
<template>
  <container>
    <template #title>新品上市</template>
    <template #desc>买一送一，买二送三</template>
    <template #main
      ><div class="new">
        <ul class="right">
          <li v-for="ele in newlist" :key="ele.id">
            <router-link :to="'/detail/' + ele.id">
              <gooditem :item="ele"></gooditem
            ></router-link>
          </li>
        </ul></div
    ></template>
  </container>
</template>
<style lang="scss" scoped>
.new {
  margin-top: 20px;
  .right {
    display: flex;
    flex: 1;
    justify-content: space-between;
  }
}
</style>
